<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <title>Elix ListComboBox</title>

    <link rel="stylesheet" href="demos.css" />
    <script type="module" src="../define/ListComboBox.js"></script>
  </head>

  <body role="main">
    <!-- For auto-complete behavior, use AutoCompleteComboBox instead. -->
    <div class="demo padded">
      Pet:
      <elix-list-combo-box aria-label="Pet">
        <div value="Canary">Canary</div>
        <div value="Cat">Cat</div>
        <div value="Chicken">Chicken</div>
        <div value="Chinchilla">Chinchilla</div>
        <div value="Cockatiel">Cockatiel</div>
        <div value="Cricket">Cricket</div>
        <div value="Dog">Dog</div>
        <div value="Ferret">Ferret</div>
        <div value="Finch">Finch</div>
        <div value="Fish">Fish</div>
        <div value="Frog">Frog</div>
        <div value="Gerbil">Gerbil</div>
        <div value="Guinea">Guinea Pig</div>
        <div value="Hamster">Hamster</div>
        <div value="Hermit">Hermit Crab</div>
        <div value="Lizard">Lizard</div>
        <div value="Mouse">Mouse</div>
        <div value="Parakeet">Parakeet</div>
        <div value="Parrot">Parrot</div>
        <div value="Pig">Pig</div>
        <div value="Rabbit">Rabbit</div>
        <div value="Rat">Rat</div>
        <div value="Snail">Snail</div>
        <div value="Snake">Snake</div>
        <div value="Spider">Spider</div>
        <div value="Turtle">Turtle</div>
      </elix-list-combo-box>
    </div>
  </body>
</html>
